<template>
  <div>
    <h2>{{ todo.content }}</h2>
    <el-input placeholder="请输入内容"></el-input>
    <el-button @click="modify" type="primary">修改</el-button>
    <el-button type="danger">删除</el-button>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "Modify",
  data() {
    return {
      todo: {},
    };
  },
  /* created() {
    const id = this.$route.params.id
    axios({
      url: `https://api.yizhanketang.cn/api/v1/todos/${id}`
    }).then(res => {
      const { data } = res.data
      console.log(data)
      this.todo = data
    })
  },*/

  async created() {
    const id = this.$route.params.id;
    try {
      const res = await axios({
        url: `https://api.yizhanketang.cn/api/v1/todos/${id}`,
      });
      const { data } = res.data;
      this.todo = data;
    } catch (e) {
      console.log(e);
    }
  },
  methods: {
    modify() {
      console.log(this.$route);
      console.log(this.$router);
    },
  },
};
</script>

<style scoped>
.el-input {
  width: 300px;
}
.el-button + .el-button {
  margin-left: 0;
}
</style>
